const fs = require('fs')
const path = require('path')

/* 读取index.html文件 */

/* 截取css   js代码  写入到对应的css  js文件夹中 */

fs.readFile(path.join(__dirname, 'index.html'), 'utf8', (err, dataStr) => {
    if (err) return console.log(err)
    var regCss = /<style>[\s\S]*<\/style>/
    var regScript = /<script>[\s\S]*<\/script>/
    // console.log(dataStr)
    // var  regCss=/<style>[\s\S]*<\/style>/
    // var  regScript=/<script>[\s\S]*<\/script>/

    // var cssStr=regCss.exec(str)
    //    var  css1= styleFunc(dataStr)  //  获取的是没有style的样式
    //    console.log(css1)
    //  将获取的样式写入到index.css中
    //    fs.writeFile(path.join(__dirname,'index.css'),css1,(err)=>{
    //        if(err) return console.log(err)
    //    })

    /* 1-抽离css和js */

    styleFunc(dataStr,regCss)

    // var jsStr=regScript.exec(dataStr)
    // console.log(jsStr[0],8888)
    scriptFunc(dataStr,regScript)


    /* 2-将结构中的style和script替换变成引入文件 */
    // dataStr

    htmStr(dataStr,regCss,regScript)




})

//  获取css代码样式
function styleFunc(dataStr,regCss) {
   
    var cssStr = regCss.exec(dataStr)
    console.log(cssStr,8888)
    var css = cssStr[0].replace('<style>', '').replace('</style>', '')
   
    // console.log(cssStr[0].replace('<style>',''))
    // return css

    fs.writeFile(path.join(__dirname, 'index.css'), css, (err) => {
        if (err) return console.log(err)

    }) 

   // replaceLink(dataStr,cssStr)

}

//   获取js代码样式
function scriptFunc(dataStr,regScript) {
   
    var jsStr = regScript.exec(dataStr)
    var script = jsStr[0].replace('<script>', '').replace('</script>', '')
    // console.log(cssStr[0].replace('<style>',''))
    // return css

    fs.writeFile(path.join(__dirname, 'index.js'), script, (err) => {
        if (err) return console.log(err)
    })

  // replaceScript(dataStr,jsStr)
}


// function  replaceLink(dataStr,cssStr){
//         /* 获取到style的代码 */

//     /*   cssStr[0]
//     <style>
//     html{
//         *:0
//     }
//     </style>

//     ======

//     <link  />
    
    

//     dataStr====html
//     cssStr[0]===<style></style>
       
//     */
//     var  qq=dataStr.replace(cssStr[0],'<link rel="stylesheet" href="./index.css">')
  
//     console.log(qq)

//     fs.writeFile(path.join(__dirname,'./index.html'),qq,(err)=>{
//         if (err) return console.log(err)
//     })
// }

// function  replaceScript(dataStr,jsStr){
//     /* 获取到style的代码 */

// /*   cssStr[0]
// <style>
// html{
//     *:0
// }
// </style>

// ======

// <link  />



// dataStr====html
// cssStr[0]===<style></style>

// */
// var  qq=dataStr.replace(jsStr[0],'<script src="./index.js"></script>')


// fs.writeFile(path.join(__dirname,'./index.html'),qq,(err)=>{
//     if (err) return console.log(err)
// })
// }

function   htmStr(dataStr,regCss,regScript){
    var  cssStr=regCss.exec(dataStr) //  获取style
    var  jsStr=regScript.exec(dataStr) //  获取style
    var  dataStr2=dataStr.replace(cssStr[0],'<link rel="stylesheet" href="./index.css">').replace(jsStr[0],'<script src="./index.js"></script>')

    fs.writeFile(path.join(__dirname,'./index2.html'),dataStr2,(err)=>{
        if (err) return console.log(err)
    })

}

